<div class="signup-form-container container">
  <div class="panel panel-default signup-form">
    <div class="panel-heading">
      <h4 class="panel-title">注册</h4>
    </div>
    <div class="panel-body">
      <form (ngSubmit)="onSubmit()">
        <div class="form-group">
          <label for="username">用户名</label>
          <input id="username" type="text" class="form-control"
                 required [(ngModel)]="user.username" name="username" pattern="^[a-zA-Z]\S{3,15}$" title="用户名要求以字母开头，长度为4-16个字符">
        </div>
        <div class="form-group">
          <label for="password">密码</label>
          <input id="password" type="password" class="form-control" name="password"
                 required [(ngModel)]="user.password" pattern="^(?=.*\d)(?=.*[a-zA-Z])\S{4,16}$" title="密码要求至少包含一个数字和一个字母，长度为4-16个字符">
        </div>
        <div class="form-group">
          <label for="pwd-repeat">重复密码</label>
          <input id="pwd-repeat" type="password" class="form-control"
                 required [(ngModel)]="user.pwdRepeat" name="pwdRepeat" pattern="^(?=.*\d)(?=.*[a-zA-Z])[a-zA-Z]\S{4,16}$">
        </div>
        <div class="form-group">
          <label for="email">E-mail</label>
          <input id="email" type="email" class="form-control"
                 required [(ngModel)]="user.email" name="email">
        </div>
        <!--<div class="form-inline">-->
          <!--<div class="form-group captcha-group">-->
            <!--<label for="captcha">验证码</label>-->
            <!--<input id="captcha" type="text" class="form-control input-captcha"-->
                   <!--required [(ngModel)]="user.captcha" name="captcha">-->
            <!--<button class="btn btn-warning btn-captcha"-->
                    <!--type="button">获取验证码-->
            <!--</button>-->
          <!--</div>-->
        <!--</div>-->
        <div class="form-right">
          <a class="btn btn-link" [routerLink]="['/login']">登陆</a>
          <button class="btn btn-success"
                  type="submit" [disabled]="submitBtnDisabled||user.pwdRepeat!=user.password">提交
          </button>
        </div>
        <alert *ngIf="user.pwdRepeat!=user.password" type="danger" [dismissible]="true">两次密码输入不一致，请查正后再试</alert>
      </form>
    </div>
  </div>
</div>
